{% extends "base.html" %}
{%load staticfiles %}
{% block title %}
文章详情
{% endblock title%}
{% block content %}
<link href="{% static 'bootstrap/css/mlist.css' %}" rel="stylesheet" type="text/css" />

<!-- 文章详情 -->
<div class="container">
    <div class="row2">
        <!-- 标题及作者 -->
        <h1 class="col-12 mt-4 mb-4">{{ article.title }}</h1>
        <div class="col-12 alert alert-success">作者：{{ article.author }}
            {% if user.id == article.author_id %}
           . <a href="#" onclick="confirm_delete()">删除文章</a>
             <a href="{% url 'article:article_update' article.id %}">编辑文章</a>
            {% endif %}
        </div>
        <!-- 文章正文 -->
        <div style="width: 100%;background=#000000;display:block;word-break: break-all;word-wrap: break-word;class="col-12">
            <p>{{ article.body|safe }}</p>
        </div>

    </div>
    <br/>
    <br/>
    <hr class="hr2" />
    <div>
        {% for i in  remark %}
            {% if i.aid == article.id %}
            <p>
         <span class="box4">{{i.name}}</span>
          <p class="box3">{{i.id}}楼 &nbsp; {{i.create_time}} &nbsp;<a href="{% url 'remark:reply' i.id article.id%}"> 回复</a></p>
          <span class="">{{i.text}}</span>
          </p>

            <div class="ncom">
                {% for aReply in articleReply %}
                    {% if aReply.modelsid == i.id %}
                       <span class="box4">{{aReply.name}}</span>：<span class="">{{aReply.text}}</span>
                               <p class="box3">
                                at &nbsp;{{ aReply.create_time }}
                                </p>
                        <HR style="border:1 dashed #987cb9" width="100%" color=#987cb9 SIZE=1>
                    {% endif %}
                {% endfor %}
            </div>
        <br/>
          {% endif %}
         <div class="ncom">
        {% if reply %}
             {% if cid == i.id %}
             <form name="text" method="post" action="{% url 'remark:commit' i.id article.id%}">
                 {% csrf_token %}
                 <input name="text" type="text">
                 <p><button type="submit" class="box3">提交</button></p>
             </form>
             {% endif %}
        <HR style="border:1px dashed #334455" width="80%" color=#987cb9 SIZE=1>
        {% endif %}
        </div>

        {% endfor %}
    </div>

    <div class="row">
        {% if user.is_authenticated %}
            我来评论两句~

        <form method="post" action="{% url 'remark:remark' article.id %}">
            {% csrf_token %}
                    <br/>
            <textarea name="text" style="width: 300px; height: 100px"></textarea>
            <p><button type="submit" class="box3">提交</button></p>
         </form>
        {% else %}
            还没登录？快来
        <a href="{% url 'userprofile:login' %}">登录</a>
        吧！
        {% endif %}
    </div>

</div>

<script>
    // 删除文章的函数
    function confirm_delete() {
        // 调用layer弹窗组件
        layer.open({
            // 弹窗标题
            title: "确认删除",
            // 正文
            content: "确认删除这篇文章吗？",
            // 点击确定按钮后调用的回调函数
            yes: function(index, layero) {
                // 指定应当前往的 url
                location.href='{% url "article:article_delete" article.id %}'
            },
        })
    }
</script>
{% endblock content %}